// eslint-disable-next-line no-unused-vars
import VXETable, { Column } from 'vxe-table'
import createBem from '@Components/assets/js/utils/bem'
import { tableNamespace } from '../../../config'
import { TRADE_FROM_TYPE } from '@Components/assets/js/config'
import './index.scss'

const Bem = createBem(`${tableNamespace}__nick-name`)

VXETable.renderer.add('NickName', {
  renderDefault(h, renderOpts, params) {
    const { row, column } = params
    /**
     * typeField：店铺类型的key
     * idField：用户id的key
     */
    const { options = {} } = renderOpts
    const { typeField, idField } = options
    let iconName = ''

    switch (row[typeField]) {
      case TRADE_FROM_TYPE.TB:
        iconName = 'icon-wangwang'
        break
      case TRADE_FROM_TYPE.JD:
        iconName = 'icon-jingdong jingdong-font-color'
        break
      case TRADE_FROM_TYPE.PDD:
        iconName = 'icon-pinduoduo pinduoduo-font-color'
        break
      default:
        iconName = 'hidden'
    }

    function onClickLinks(e) {
      e.stopPropagation()
      window.open(
        `https://amos.alicdn.com/getcid.aw?uid=${row[idField]}&site=cntaobao&charset=utf-8`,
        '_blank'
      )
    }
    return [
      <div class={Bem()}>
        <i
          class={`iconfont link default-icon-color ${iconName}`}
          onClick={onClickLinks}
        />
        <span>{row[column.property]}</span>
      </div>
    ]
  }
})

/** @type { Column } */
export const options = {
  showOverflow: 'tooltip',
  align: 'left'
}
